<template>
    <div class="hexagon flex-al al-c j-c">
        <span class="t1">{{name}}</span>
        <div class="line-row"></div>
        <span class="t2">{{date}}</span>
    </div>
</template>
<script>
export default {
    props:{
        'name': {
            type: String,
            default: '名字'
        },
        'date': {
            type: String,
            default: "日期"
        }
    },
    data(){
        return{

        }
    }
}
</script>
<style lang="less" scoped>
.hexagon{
    width: 90px*0.9;
    height: 103px*0.9;
    background: url("~@/assets/imgs/六边形.png") no-repeat;
    background-size:cover;
    // .hover;
    
    .t1{
        font-size: 13px;
     color: #FFFFFF;
     margin: 0;
    
    }
    .line-row{
        width: 17px;
        margin:5px 0;
    }
    .t2{
        font-size: 19px;
    color: #FFFFFF;
    font-weight: bolder;
 margin: 0;
    }
}
</style>